/**
 * Created by yeanzhi on 15/5/6.
 */
import React from 'react'
import Router from 'react-router'
//import Box from './box.js'
var { Route, Redirect, RouteHandler, State,Link ,DefaultRoute} = Router;
//class App extends React.Component{
//    constructor(props){
//        super(props);
//    }
//
//}
class Box extends React.Component{
    constructor(props){
        super(props);
    }
    render() {
        return(
            <div>
                hello
            </div>
        )
    }
}
var AA = React.createClass({
    contextTypes: {
        router: React.PropTypes.func
    },
    render() {
        return(
            <div>
                hello
            </div>
        )
    }
})

var App = React.createClass({
    render:function() {
        return(
            <div>
                <ul>
                    <li><Link to="user" params={{userID: "123"}}>Bob</Link></li>
                    <li><Link to="user" params={{userID: "123"}} query={{showAge: true}}>Bob With Query Params</Link></li>
                    <li><Link to="user" params={{userID: "abc"}}>Sally</Link></li>
                </ul>
                <RouteHandler/>
            </div>
        )
    }
})
//App.contextTypes={router: React.PropTypes.func.isRequired}

var User = React.createClass({
    contextTypes: {
        router: React.PropTypes.func
    },

    render: function () {
        var { router } = this.context;
        var age = router.getCurrentQuery().showAge ? '33' : '';
        var userID = router.getCurrentParams().userID;
        return (
            <div className="User">
                <h1>User id: {userID}</h1>
                {age}
            </div>
        );
    }
});


var routes = (
    <Route handler={App} name="index" path="/">
        <DefaultRoute handler={Box} />
        <Route name="user" path="user/:userID" handler={User}/>
    </Route>
);
Router.run(routes, function (Handler) {
    React.render(<Handler/>, document.body);
});

























